<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
</head>
<body>
  <!-- 
    header
      头部
    nav
      导航
    article
      文章
    section
      块
    aside
      侧边栏
    footer
      底部
      这些标签就是一些有语义的块元素而已（并没有默认样式）

      这些结构标签在IE8中是不支持的
      html5shiv.min.js 

      这个js只能让结构标签被支持，不能让一些有特定功能的标签被兼容

      respond.js 是让IE8支持@media

      json2.js IE7兼容JSON
  -->
  <div class="header">
    <div class="nav"></div>
  </div>
  <div class="section">
    <div class="artilce"></div>
    <div class="artilce"></div>
    <div class="artilce"></div>
  </div>
  <div class="aside"></div>
  <div class="footer"></div>

  <header>
    <nav>导航</nav>
  </header>
  <section>
    <article>文章</article>
    <article>文章</article>
    <article>文章</article>
  </section>
  <aside>侧边栏</aside>
  <footer>底部</footer>

  <meter value="1" min="0" max="10">5/10</meter>
</body>
</html>